<template>
	<uni-popup ref="popup" type="center">
		<uni-card title="商品SKU">
			<template v-slot:title>
				<view class="gl-header">
					<view style="display: flex;align-items: center;">
						<text>{{mid}}</text>
						<text style="padding: 4px;">-</text>
						<text selectable style="font-weight: bold;">{{title}}</text>
					</view>
					<view class="">
						<!--
						<view class="gl-button gl-button-base" hover-class="button-base-hover" :hover-stay-time="100"
							@click="refresh">
							<uni-icons type="reload" size="18" color="#fff"></uni-icons>
							<text style="font-size: small;">刷新</text>
						</view>
						<view class="gl-button gl-button-error" hover-class="button-base-hover" :hover-stay-time="100"
							@click="close">
							<uni-icons type="plus-filled" size="18" color="#fff"></uni-icons>
							<text style="font-size: small;">关闭</text>
						</view>
						-->
						<view class="pop-close-button" @click="close">
							<uni-icons type="plus-filled" size="40" color="#dd524d"></uni-icons>
						</view>
					</view>
				</view>
			</template>
			<view class="gl-body table-container" style="padding-left: 5px;">
				<uni-table stripe type="selection" emptyText="暂无更多数据">
					<uni-tr class="table-head">
						<uni-th align="center">ID</uni-th>
						<uni-th align="center" width="80">标识</uni-th>
						<uni-th>等级</uni-th>
						<uni-th>折扣(‰)</uni-th>
						<uni-th>推荐(‰)</uni-th>
						<uni-th>平级津贴(‰)</uni-th>
						<uni-th>董事分红(‰)</uni-th>
						<uni-th>商户业绩(‰)</uni-th>
					</uni-tr>
					<uni-tr v-for="(item, index) in tmpData" :key="'item'+index">
						<uni-td align="center">{{item.id}}</uni-td>
						<uni-td align="center" width="80">
							<view class="">
								<image :src="sConf.cos + (item.sub_level.icon ?? '/media/default/cover.png')"
									mode="heightFix" style="width: 32x;height:32px;border-radius: 5px;"></image>
							</view>
						</uni-td>
						<uni-td>{{item.sub_level.name}}</uni-td>
						<uni-td> <uni-number-box :value="item.discount" :min="0" :max="1000"
								:disabled="true"></uni-number-box></uni-td>
						<uni-td><uni-number-box :value="item.profit" :min="0" :max="1000"
								:disabled="true"></uni-number-box></uni-td>
						<uni-td><uni-number-box :value="item.prize" :min="0" :max="1000"
								:disabled="true"></uni-number-box></uni-td>
						<uni-td><uni-number-box :value="item.draw" :min="0" :max="1000"
								:disabled="true"></uni-number-box></uni-td>
						<uni-td><uni-number-box :value="item.ofpos" :min="0" :max="1000"
								:disabled="true"></uni-number-box></uni-td>
					</uni-tr>
				</uni-table>
			</view>
		</uni-card>
	</uni-popup>
</template>

<script>
	import psMethod from '@/common/psMethod';
	export default {
		data() {
			return {
				title: '权益模板',
				sConf: getApp().globalData,
				tmpData: [],
				mid: 1
			}
		},
		methods: {
			close() {
				this.$refs.popup.close()
			},
			open(e) {
				this.mid = e.id
				this.title = e.name
				this.loadDefDataList()
				this.$refs.popup.open()
			},
			refresh() {
				this.loadDefDataList()
			},
			loadDefDataList() {
				let token = this.sConf.auth.token ?? ''
				let data = {
					ordering: '-level',
					mode: this.mid
				}
				psMethod.syncAuthenticatorRequest('/admin/modeAttr/', 'GET', token, data).then(res => {
					console.log('加载权益参数列表', res);
					this.tmpData = res.resmsg
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pop-close-button {
		padding: 10px;
		transform: rotate(45deg);
	}
</style>